/**
 * @Author:刘忻忻，高志斐
 * @Date:2020/7/1
 * @Description:这是设置支付密码界面
 */
import React, {Component} from "react";
import { getCookieId} from "../Login/Component_Login/GetCookie";
import axios from "axios";
import {NavBar, Icon, InputItem, List, WhiteSpace, Button, Toast} from 'antd-mobile';
import {URL} from "../../index";

export default class SetPassword extends Component{
    state = {
        payPassword:'',//支付密码
        repeatPassword:'',//确认支付密码
    }
    //变更密码
    onChangePasswd = (payPassword) => {
        this.setState({
            payPassword
        })
    }
    //变更确认密码
    onChangeRepeat = (repeatPassword) => {
        this.setState({
            repeatPassword
        })
    }
    //提交用户输入的所有实名认证信息
    handleSubmit(event) {
        if (this.state.payPassword === "" || this.state.payPassword === null) {
            Toast.info('请设置支付密码');
        } else if (this.state.repeatPassword === "" || this.state.repeatPassword === null) {
            Toast.info('请确认支付密码');
        }else if(this.state.payPassword !== this.state.repeatPassword){
            Toast.info('两次输入的密码不一致！');
        }else if(this.state.payPassword.length!==6){
            Toast.info('支付密码为6位数字！');
        }
        else {
            //打印查看是否成功拿到数据
            //console.log(localStorage.getItem('userName'));
            //提交数据
            axios({
                    method: "POST",
                    url:URL + "/userInfo/realNameAuthentication",
                    data:{
                        userId: getCookieId(),  // 用户id
                        userName: localStorage.getItem("userName"),
                        userCard: localStorage.getItem("userCard"),
                        userAddress: localStorage.getItem("userAddress"),
                        userPhone: localStorage.getItem("userPhone"),
                        userPassword: this.state.payPassword
                    }
            }).then(res => {
                console.log(res.data)
                    if (res.data.code === 200) {
                        Toast.success('认证成功');
                        // 路由
                        this.props.history.push("/approveResult")
                    } else {
                        Toast.fail('提交失败', 2);
                    }
                })
            //清除缓存数据
            localStorage.removeItem("userName");
            localStorage.removeItem("userCard");
            localStorage.removeItem("userAddress");
            localStorage.removeItem("userPhone");
        }
    }
    render() {
        return (
            <div className='setup-container'>
                <NavBar
                    mode="light"
                    icon={<Icon type="left" style={{color:"#f8a83f"}}/>}
                    onLeftClick={() => window.history.back(-1)}
                >设置支付密码</NavBar>
                <WhiteSpace/>
                <WhiteSpace/>
                <div className='setup-former' style={{marginTop:"0px"}}>
                    <List>
                        <InputItem
                            type="password"
                            placeholder="请输入6位支付密码"
                            clear
                            value={this.state.payPassword}
                            onChange={this.onChangePasswd}
                        >请输入密码</InputItem>
                    </List>
                    <WhiteSpace/>
                    <WhiteSpace/>
                    <List>
                        <InputItem
                            type="password"
                            placeholder="请再次输入密码进行确认"
                            clear
                            value={this.state.repeatPassword}
                            onChange={this.onChangeRepeat}
                        >密码确认</InputItem>
                    </List>
                </div>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <WhiteSpace/>
                <div className='setup-button' style={{marginTop:'300px'}}>
                    <Button style={{backgroundColor:"#f8a83f",width:"40%",margin:"0 auto",color:"white"}} onClick={this.handleSubmit.bind(this)}>提交</Button>
                </div>
            </div>
        )
    }
}
